<template>
	<view>
			<view class="store_modules">
      <!--主内容-->
      <view class="store_main" @click="apply_mini('complete')">
        <!--左侧区域-->
        <view class="store_title_img">
          <view class="total_img bind_mini">
            <text class="iconfont icon-shouquan"></text>
          </view>
          <view class="store_main_title">
            <view class="store_title">绑定小程序</view>
            <view class="store_sub_title"
              >无需复杂操作即可拥有微信小程序商城</view
            >
          </view>
        </view>
        <!--右侧icon-->
        <view class="store_right">
          <view class="iconfont icon-arrow-right"></view>
        </view>
      </view>
      <!--提示信息-->
      <view class="store_tips" v-if="progress <= 2">
        <view class="tips_title">您提交的内容有如下错误：</view>
        <view class="tips_msg">{{ msg }}</view>
      </view>
    </view>
    <view class="store_modules">
      <!--主内容-->
      <view class="store_main" @click="apply_mini('wechantPayMent')">
        <!--左侧区域-->
        <view class="store_title_img">
          <view class="total_img pay_bind">
            <text class="iconfont icon-consumption-fill"></text>
          </view>
          <view class="store_main_title">
            <view class="store_title">支付进件</view>
            <view class="store_sub_title"
              >自动成为商户，进行收款，无需人为添加</view
            >
          </view>
        </view>
        <!--右侧icon-->
        <view class="store_right">
          <view class="iconfont icon-arrow-right"></view>
        </view>
      </view>
      <!--提示信息-->
      <view class="store_tips" v-if="progress == 3">
        <view class="tips_title">您提交的内容有如下错误：</view>
			
        <view class="tips_msg">
					<u-parse :html="msg"></u-parse>
				</view>
      </view>
    </view>
			<view class="store_modules">
      <!--主内容-->
      <view class="store_main" @click="apply_mini('weQrcode')">
        <!--左侧区域-->
        <view class="store_title_img">
          <view class="total_img qrcode_bind">
            <text class="iconfont icon-QRcode"></text>
          </view>
          <view class="store_main_title">
            <view class="store_title">绑定收款码</view>
            <view class="store_sub_title">快速绑定关联聚合收款码</view>
          </view>
        </view>
        <!--右侧icon-->
        <view class="store_right">
          <view class="iconfont icon-arrow-right"></view>
        </view>
      </view>
      <!--提示信息-->
      <view class="store_tips" v-if="progress == 4">
        <view class="tips_title">您提交的内容有如下错误：</view>
        <view class="tips_msg">{{ msg }}</view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
				store_id : 0,
      msg: "",
      progress: 0,
				mini_id : 0
			}
  },
  onLoad(e) {
    if (e.id) {
				this.store_id = e.id
    }
  },
	onShow(){
		this.getCompleteInfo();
	},
  methods: {
    // 获取小程序完善信息
    async getCompleteInfo() {
      const res = await this.$allrequest.newStore.get_progress(
        {
			      bind_store_id: this.store_id,
        },
        true
      );
      if (res.code == 0) {
        this.msg = res.msg;
        this.progress = res.data.progress;
        this.mini_id = res.data.mini_id;
        this.qrcode_id = res.data.qrcode_id;
        this.status = res.data.status;
      }
    },

    apply_mini(e) {
      let { store_id, mini_id, progress, qrcode_id, status } = this,
        url = "";

      if (progress === 5) {
        uni.navigateTo({
          url: `/salesman/checkShop/checkShop`,
        });
        return;
      }

      url += `/new_store/wechat/${e}`;
      switch (e) {
        case "complete":
          // 4等待审核
          // 0.1.2 跳转绑定小程序
          if (progress > 2) {
            uni.showToast({
              title: "此项已完成~",
              icon: "none",
            });
            return;
          }

          url += `?id=${store_id}&mini_id=${mini_id}`;
          break;

        case "wechantPayMent":
          if (progress < 3) {
            uni.showToast({
              title: "其他项目未完成~",
              icon: "none",
            });
            return;
          } else if (progress > 3) {
            uni.showToast({ title: "此项已完成~", icon: "none" });
            return;
          }

          url += `?id=${store_id}&mini_id=${mini_id}`;
          break;

        case "weQrcode":
          if (progress < 4) {
            uni.showToast({ title: "其他项目未完成~", icon: "none" });
            return;
          }

          url += `?mini_id=${mini_id}&qrcode_id=${qrcode_id}&status=${status}`;
          break;
      }

      uni.navigateTo({
        url,
      });
    },
  },
};
</script>

<style scoped>
.store_main,
.store_title_img {
  display: flex;
  align-items: center;
}

.store_modules {
  padding: 34rpx 0;
  border-bottom: 1px solid #ececec;
}

.total_img {
  width: 80rpx;
  height: 80rpx;
  border-radius: 50%;
  background: #dcdcdc;
  display: flex;
  justify-content: center;
  align-items: center;
}

.total_img text {
  font-size: 40rpx;
  color: #fff;
}

.bind_mini {
  background: #31aafa;
}

.pay_bind {
  background: #fbb13e;
}

.qrcode_bind {
  background: #754ccd;
}

.store_main {
  justify-content: space-between;
  padding: 0 20rpx;
}

.store_main_title {
  margin-left: 20rpx;
}

.store_title {
  font-weight: 700;
  color: #101010;
  font-size: 32rpx;
  margin-bottom: 10rpx;
}

.store_right {
  color: #b1b1b1;
}

.store_right view {
  font-size: 20rpx;
}

.store_sub_title {
  font-weight: 500;
  color: #adadad;
  font-size: 26rpx;
}

.store_tips {
  margin: 38rpx 20rpx 0;
  padding: 16rpx 20rpx;
  background: #f5f5f5;
  border-radius: 8rpx;
}

.tips_title {
  font-weight: 600;
  color: #2d2d2d;
  margin-bottom: 10rpx;
  font-size: 24rpx;
}

.tips_msg {
  font-weight: 600;
  color: #fb5252;
  line-height: 40rpx;
  font-size: 24rpx;
}
</style>
